Ext.onReady(function(){ 

Ext.QuickTips.init();
Ext.form.Field.prototype.msgTarget = 'under';

//树状结构
var treePanel = new Ext.tree.TreePanel({
    el : 'tree-panel',// 将树形添加到一个指定的div中,非常重要！
    title : '人员管理工作台',
    width :200,
    height : 480,
    split : true,
    lines:true,
    autoHeight : false,
    containerScroll : true,// 是否支持滚动条
    rootVisible : true, // 是否隐藏根节点,很多情况下，我们选择隐藏根节点增加美观性
    collapsible:false,
    collapsed:false,
    collapseFirst:true,
    titleCollapse:true,
    border : false,
    //border : true, // 边框

    animate : true, // 动画效果

    loader : loader,
        // 树加载
    listeners:{ 
    	render:function(tree){ 
    		treePanel.el.on('click',function(e){ 
			e.stopPropagation(); }) ;
		} 
	} 

    });

var loader=new Ext.tree.TreeLoader({dataUrl:'system/showOrgTree.do'});

var treeRoot=new Ext.tree.AsyncTreeNode
({
 id:"0", 
 leaf:false,
 loader: loader,
 text:"清远农商行总行",
 expandable:true,
 expanded:true 
});         

treePanel.setRootNode(treeRoot);
treePanel.render();

var treeClick = function(node,e)
{
 var flag = false; 
  if(node.attributes.leaf)
  {
      if(node.isLeaf())
      {
    	  e.stopEvent();
    	  flag = true;
      }
     
  }
	Ext.Ajax.request({
		url:'system/loadUserTreeFromParent.do',
		params : { orgId: node.id, isLeaf: flag},
		method:'POST',
		   success:function(response){
			   grid.store.reload(); 
			   treePanel.root.reload();
		  },failure:function(){
		    Ext.MessageBox.alert("请求异常！");
		  }
		});
  
};
treePanel.on("click",treeClick); 



Ext.grid.CheckColumn = function(config)  {  
    Ext.apply(this, config);  
    if(!this.id)  {  
    this.id = Ext.id();  
    }  
    this.renderer = this.renderer.createDelegate(this);  
};  
Ext.grid.CheckColumn.prototype =  {  
init : function(grid)  {  
    this.grid = grid;  
    this.grid.on('render', function()  {  
    var view = this.grid.getView();  
    view.mainBody.on('mousedown', this.onMouseDown, this);  
    }, this);  
},   
  
onMouseDown : function(e, t)  {  
    if(t.className && t.className.indexOf('x-grid3-cc-'+this.id) != -1)  {  
    e.stopEvent();  
    var index = this.grid.getView().findRowIndex(t);  
    var record = this.grid.store.getAt(index);  
    record.set(this.dataIndex, !record.data[this.dataIndex]);  
    }  
},   
  
renderer : function(v, p, record)  {  
    p.css += ' x-grid3-check-col-td';  
    return '<div class="x-grid3-check-col'+(v?'-on':'')+' x-grid3-cc-'+this.id+'"> </div>';  
}  
};

var checkColumn = new Ext.grid.CheckColumn({  
    header: "选择",  
    dataIndex: 'checkSelect',  
    width: 30  
}); 

//Gridpanel
var record_start = 0; 
var cm=new Ext.grid.ColumnModel([
checkColumn ,   
new Ext.grid.RowNumberer({header: "编号",
	width:40, 
	renderer:function(value,metadata,record,rowIndex){ 
	return record_start + 1 + rowIndex; 
	} 
	}),
{header:'角色号',dataIndex:'roleId',hidden:true
} ,

{header:'角色名称',
	sortable: true, 
	dataIndex:'roleName',
	width:100
    },
{header:'角色说明',
		sortable: true, 
		dataIndex:'roleDesc',
		width:165
},

{header:'登记时间',
dataIndex:'inputDate',
width:100, 
renderer: function (value, metadata, record){
	metadata.attr = 'style="white-space:normal;"'; 
	return value; 
}
},

{header:'更新时间',
	sortable: true,
	dataIndex:'updateDate',
	width:100
}

]); 

var ds = new Ext.data.Store({ 
proxy:new Ext.data.HttpProxy({
url:'system/viewUserRole.do',
method:'POST'
}), 
reader:new Ext.data.JsonReader({ 
totalProperty:'total',  
root:'resultData'},[
{name:'roleId'},
{name:'roleName'},
{name:'roleDesc'}, 
{name:'checkSelect'},
{name:'inputDate'},
{name:'updateDate'}
]) 
}); 
ds.load(); 


var grid=new Ext.grid.EditorGridPanel({ 
id:'myCustomers',
renderTo:"list",
stripeRows:true,//斑马线效果
height:1100, 
title:'<div align="center">该用户关联的角色</div>', 
cm:cm,
store: ds, 
clicksToEdit: 1,
columnLines:true, 
plugins:checkColumn,
cls: 'grid-row-span',
loadMask: { msg: "加载中..." }, 
viewConfig: {   
                            forceFit:true   
            },  
tbar: [{text:'提交',  handler:submitM},'-']               
});

grid.store.on('load', function() {  
    grid.el.select("table[class=x-grid3-row-table]").each(function(x) {  
        x.addClass('x-grid3-cell-text-visible');  
    });  
});  

function submitM(){
	var mr=ds.getModifiedRecords();//获取所有更新过的记录  
     var recordCount=ds.getCount();//获取数据集中记录的数量  
     if(mr.length==0){  // 确认修改记录数量  
    	 	Ext.MessageBox.alert("提示","没有修改数据！"); 
       return false;  
     }  
       
     var recordModStr="[";//这里以josn方式保存  
     for(var i=0;i<mr.length;i++){ 
     recordModStr+=Ext.util.JSON.encode(mr[i].data);
    
      //recordModStr+="{serialNo:"+"\""+mr[i].data["serialNo"]+"\""+",pdlevel:"+"\""+mr[i].data["pdlevel"]+"\""+",pdvalue:"+mr[i].data["pdvalue"]+"}";  
       
     	if(i<mr.length-1)  
      	recordModStr+=","; 
    } 
     recordModStr+="]";
    
     //alert(recordModStr);
     Ext.Ajax.request({
		url:'system/modifyUserRole.do',
		params : { newRecord: recordModStr},
		method:'POST',
		success:function(){
			Ext.MessageBox.alert("提示","提交成功！");
			grid.store.reload(); 
		},failure:function(){
			grid.store.reload(); 
			Ext.MessageBox.alert("提示", "提交失败！"); 
		}
	});  
}
}); 